<script setup lang='ts'>
import { ref } from 'vue';
import {ConfigDataType} from '@/utils/enum'
import { useTextStore } from '@/stores/config/configTextStore';
import { useConfigTableStore } from '@/stores/config/configTableStore';
import {typeNames} from '@/utils/struct'
import { useTablePageStore } from '@/stores/config/tablePageStore';
import { ElNotification } from 'element-plus';
import { ViewHelper } from '@/utils/viewHelper';
let showTextSelect = ref(false)
let showTableSelect = ref(false)
let showTip = ref(false)
let textStore = useTextStore()
let tableStore = useConfigTableStore()
let pageStore = useTablePageStore()

let newColName = ref("新字段")
let newColType = ref(ConfigDataType.Integer)
let newColNumber = ref(0)
let newColBoolean = ref(false)
let newColId = ref(0)
let newColKey = ref("unknown")
let showTableRowSelect = ref(false)

const emit = defineEmits(["confirm"])
const onClickConfirm = ()=>{
    let str = newColKey.value
    if (pageStore.selectedTable == null) {
        return ;
    }
    for (let i = 0; i < pageStore.selectedTable.tableHeader.length; i++) {
        if (pageStore.selectedTable.tableHeader[i].key == str) {
            showTip.value = true
            return ;
        }
    }
    let value = newColNumber.value
    if (newColType.value == ConfigDataType.Boolean) {
        value = newColBoolean.value ? 1 : 0
    }
    emit("confirm", {
        id: newColId.value,
        name: newColName.value,
        type: newColType.value,
        key: newColKey.value,
        value: value,
    })
}

let onConfirmText = function(id:number) {
    newColNumber.value = id;
    showTextSelect.value = false
}
let confirmSelectTable = function(id:number) {
    if (id == pageStore.selectedId) {
        ElNotification({
            title: 'Warning',
            message: '不可引用当前表格自身！',
            type: 'warning',
        })
        return ;
    }
    newColId.value = id;
    showTableSelect.value = false
}

let onConfirmRowSelect = function(id:number) {
    newColNumber.value = id;
    showTableRowSelect.value = false;
}
</script>
<template>
    <el-dialog>
        <el-text>字段名</el-text>
        <el-input v-model="newColName"></el-input>
        <el-text>字段键</el-text>
        <el-input v-model="newColKey"></el-input>
        <el-text>数据类型</el-text>
        <el-select v-model="newColType">
            <el-option v-for="item, key in typeNames"
                :key="key"
                :value="key"
                :label="item"></el-option>
        </el-select>
        <el-input-number step-strictly :step="1" v-if="newColType==ConfigDataType.Integer" v-model="newColNumber"></el-input-number>
        <el-input-number v-if="newColType==ConfigDataType.Float" v-model="newColNumber"></el-input-number>
        <el-switch v-if="newColType==ConfigDataType.Boolean" v-model="newColBoolean"></el-switch>
        <el-button v-if="newColType==ConfigDataType.Quote" @click="showTableSelect=true">{{tableStore.getTableName(newColId, "未选择配表")}}</el-button>
        <template #footer>
            <el-button @click="onClickConfirm">确认</el-button>
        </template>
        <ConfigTableSelectDialog v-model="showTableSelect" @confirm="confirmSelectTable"></ConfigTableSelectDialog>
        <TextSelectDialog v-model="showTextSelect" @confirm="onConfirmText"></TextSelectDialog>
        <el-dialog v-model="showTip">字段键值重复</el-dialog>
        <!-- <ConfigTableRowSelectDialog 
            v-model="showTableRowSelect"
            :tableId="pageStore.selectedId"
            @confirm="onConfirmRowSelect"/> -->
    </el-dialog>
</template>
<style>
</style>